<!DOCTYPE html>
<html lang="en">
<head>
  
<meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title></title>
  <meta name="viewport" content="initial-scale=1, maximum-scale=1">
  <!-- <link rel="shortcut icon" href="http://favicon.ico"> -->
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <meta name="viewport" content="width=device-width, height=device-height, user-scalable=no, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0">


  <link rel="stylesheet" href="https://gitee.com/huaflower/ReadBook_CommonFile/raw/master/css/sm.min.css">
  <link rel="stylesheet" href="https://gitee.com/huaflower/ReadBook_CommonFile/raw/master/css/sm-extend.min.css">
  <script type="text/javascript" src="https://gitee.com/huaflower/ReadBook_CommonFile/raw/master/common/common/common.js"></script>
  <style>
    li{
      list-style: none;
    }
    a{
      text-decoration: none;
    }
    /*修改标题栏颜色*/
    .bar.bar-nav {
      background-color: #1FCA23;
    }

    /*修改标题栏字体颜色*/
    .bar.bar-nav .title {
      color: #fff;
    }
    
    /*修改工具栏背景颜色*/
    .bar.bar-tab {
      background-color: #FEEA4D;
    }
    .pull-left{
      width: 1.5rem;
      padding-top:0.3rem;
    }
    .pull-left img{
      display: block;
      width: 100%;
    }
    /*修改内容区背景色*/
    body{
      background-color:#fff;
    }
    .content{
      background-color: #fff;
    }
    .menu{
      width: 100%;
      height:2.2rem;
      border-bottom: 1px solid #ededee;
      font-size: 14px;
    }
    .menu_subject{
      width: 100%;
      height: 2.2rem;
      line-height: 2.2rem;
      text-align: center;
    }
    .study_main{
      width: 100%;
      height: auto;
      float: left;
    }
    .study_main ul{
      margin:0;
      padding:0;
    }
    .study_main ul li{
      padding:0.5rem 0.5rem 0 1.2rem;
      border-bottom: 1px solid #ededee;
      position: relative;
    }
    .main_items{
      font-size: 14px;
      color: #1FCA23;
    }
    .main_items span:last-child{
      margin-left:0.9rem;
    }
    .study_main ul li p{
      font-size: 12px;
      color: gray;
    }
    .main_icon{
      width: 2.0rem;
      position: absolute;
      top:1.1rem;
      right: 0;
    }
    .main_icon img{
      display: block;
      width: 100%;
    }
   /*点击学科分类显示的下拉页面*/
   #subshow{
     width: 100%;
     height: 8.0rem;
     background-color:#eeeeee;
     position: absolute;
     left: 0;
     top:2.1rem;
     z-index: 600;
     display: none;
   }
   #subshow>ul{
    width: 100%;
    height: 100%;
    margin:0;
    padding:0;
   }
   #subshow>ul li{
    width: 100%;
    height: 2.0rem;
    line-height:2.0rem;
    border-bottom: 1px solid #1FCA23;
    text-align: center; 
   }
   #subshow>ul li a{
    color:black;
   }

  </style>
</head>
<body>
  
  <div class="page-group">
    <div class="page">
      <!-- 标题栏 -->
      <header class="bar bar-nav">
         <a class="pull-left"><img src="https://gitee.com/huaflower/ReadBook_CommonFile/raw/master/img/img/back@2x.png"></a>
         <h1 class="title">学习情况</h1>
      </header>

      <!-- 工具栏 -->
      <!-- nav class="bar bar-tab">
        <a class="tab-item external" href="#">
          <span class="icon icon-home"></span>
          <span class="tab-label">书 架</span>
        </a>
        <a class="tab-item external active" href="#">
          <span class="icon icon-me"></span>
          <span class="tab-label">我 的</span>
        </a>
      </nav> -->

      <!-- 页面内容区域 -->
      <div class="content">
         <div class="menu">
            <div class="menu_subject">
              <span onclick="subshow()">学科分类</span>
              <img src="https://gitee.com/huaflower/ReadBook_CommonFile/raw/master/img/img/trigondown.png">
            </div>
         </div>
         <div class="study_main">
               <ul>
                  <li>
                     <h5 style="margin:0;">英语小学三年级&emsp;第一课</h5>
                     <div class="main_items">
                       <span>测试得分：&nbsp;98</span>
                       <span>学习时长：&nbsp;30分钟</span>
                     </div>
                     <p>2018.09.24 12:00:00 - 2018.09.24 12:30:00</p>
                     <div class="main_icon">
                         <img src="https://gitee.com/huaflower/ReadBook_CommonFile/raw/master/img/img/img_more_right.png">
                     </div>
                  </li>
                  <li>
                     <h5 style="margin:0;">数学小学三年级&emsp;第一课</h5>
                     <div class="main_items">
                       <span>测试得分：&nbsp;98</span>
                       <span>学习时长：&nbsp;30分钟</span>
                     </div>
                     <p>2018.09.24 12:00:00 - 2018.09.24 12:30:00</p>
                     <div class="main_icon">
                         <img src="https://gitee.com/huaflower/ReadBook_CommonFile/raw/master/img/img/img_more_right.png">
                     </div>
                  </li>
                  <li>
                     <h5 style="margin:0;">英语小学三年级&emsp;第一课</h5>
                     <div class="main_items">
                       <span>测试得分：&nbsp;98</span>
                       <span>学习时长：&nbsp;30分钟</span>
                     </div>
                     <p>2018.09.24 12:00:00 - 2018.09.24 12:30:00</p>
                     <div class="main_icon">
                         <img src="https://gitee.com/huaflower/ReadBook_CommonFile/raw/master/img/img/img_more_right.png">
                     </div>
                  </li>
                  <li>
                     <h5 style="margin:0;">数学小学三年级&emsp;第一课</h5>
                     <div class="main_items">
                       <span>测试得分：&nbsp;98</span>
                       <span>学习时长：&nbsp;30分钟</span>
                     </div>
                     <p>2018.09.24 12:00:00 - 2018.09.24 12:30:00</p>
                     <div class="main_icon">
                         <img src="https://gitee.com/huaflower/ReadBook_CommonFile/raw/master/img/img/img_more_right.png">
                     </div>
                  </li>
               </ul>
         </div>
         <!-- 点击学科分类显示的下拉页面 -->
         <div id="subshow">
           <ul>
             <li><a href="#">英语</a></li>
             <li><a href="#">数学</a></li>
             <li><a href="#">语文</a></li>
           </ul>
         </div>
       
      </div>
    </div>
  </div>

  <!-- !-- 固定的js引用，所有的jQuery 要用 $$ 表示 --> 
<script type="text/javascript" src="https://gitee.com/huaflower/ReadBook_CommonFile/raw/master/js/js/jquery-1.11.1.min.js"></script>
<!-- 这一行代码是为了 避免js冲突 -->
<script type="text/javascript">var $$ =jQuery.noConflict();</script>

<script type='text/javascript' src='https://gitee.com/huaflower/ReadBook_CommonFile/raw/master/zepto/zepto/zepto.min.js' charset='utf-8'></script>
<script type='text/javascript' src='https://gitee.com/huaflower/ReadBook_CommonFile/raw/master/js/js/sm.min.js' charset='utf-8'></script>
<!-- <script type='text/javascript' src='https://gitee.com/huaflower/CommonFile/raw/master/js/sm-extend.min.js' charset='utf-8'></script> -->
<script src="https://gitee.com/huaflower/ReadBook_CommonFile/raw/master/js/js/swiper/swiper.min.js"></script>
<script type="text/javascript">
  	
  // 点击学科分类显示的下拉页面
  function subshow(){
    if ($$('#subshow').is(':hidden')) {
        $$('.menu_subject').find('img').attr('src','https://gitee.com/huaflower/ReadBook_CommonFile/raw/master/img/img/trigonup.png');
        $$('#subshow').show();
    }else{
        $$('.menu_subject').find('img').attr('src','https://gitee.com/huaflower/ReadBook_CommonFile/raw/master/img/img/trigondown.png');
        $$('#subshow').hide();
    }
  }

  function getParams(data){
   // data需要转成json调用 ，函数urlParamParseJson();
     /*var jodata = JSON.parse(data); 
     if(isNotNull(jodata)){//
        
     }*/

}
    // 初始化
    $(function(){
      $.init();
    });
  </script>
</body>
</html>